|
问题描述：
在form表单中，正常回显表单值，点击文字，显示下拉框，选中下拉框的值，又恢复成默认状态（有一个问题就是点击文字，显示el-select选择框，不激活下拉框，再点击其他空白地方，没法恢复为默认状态只显示文字的情况）
image.png
不激活下拉框的情况，点击空白处，还是显示为选择框
image.png
我认为当点击文字显示选择框，而并未激活下拉框时，el-select并未激活任何事件，所以点击空白处，失焦是没有任何反应的，所以点击文字显示选择框的同时激活输入框的focus事件，自动聚焦，点击空白处再次失焦，显示文字（给el-select绑定ref,以便获取focus事件）
image.png
image.png
image.png
再次点击空白处，el-select失焦，显示默认文字状态，隐藏el-select选择框
image.png
但是这样写，会有一个问题，就是el-select原来的change事件失效了
点击其他地区，change事件不生效
image.png
image.png
image.png
后来查了下，说是blur事件会先于click事件发生，产生的bug。原文链接：https://blog.csdn.net/weixin_46787337/article/details/125902944
后我在blur事件中加入100毫秒的延迟解决该问题，不知道大神们有没有其他更好的解决方案啊
image.png
完整代码
image.png
image.png
image.png
|